import {
	createRouter,
	createWebHashHistory
} from "vue-router"

// 1. 定义路由组件.
import Admin from "@/views/shop/admin/index.vue"

// 2. 定义一些路由
// 每个路由都需要映射到一个组件。
// 我们后面再讨论嵌套路由。
const routes = [{
		path: "/",
		redirect: "/productList"
	},

	{ path: '/productList', component: () => import('@/views/shop/productList.vue') },
	{ path: '/productDetail', component: () => import('@/views/shop/productDetail.vue') },
	// 阶段案例-后台管理系统
	{ path: '/login', component: () => import('@/views/manageSystem/Login.vue') },
	{
		path: '/home',
		component: () => import('@/views/manageSystem/Home.vue'),
		redirect: '/home/users',
		children: [{
				path: 'users',
				component: () => import('@/views/manageSystem/MyUsers.vue')
			},
			{
				path: 'users/:id',
				name: 'userDetails',
				component: () => import('@/views/manageSystem/MyUserDetail.vue'),
				props: true
			},
			{
				path: 'rights',
				component: () => import('@/views/manageSystem/MyRights.vue')
			},
			{
				path: 'goods',
				component: () => import('@/views/manageSystem/MyGoods.vue')
			},
			{
				path: 'orders',
				component: () => import('@/views/manageSystem/MyOrders.vue')
			},
			{
				path: 'settings',
				component: () => import('@/views/manageSystem/MySettings.vue')
			},
			{
				path: 'menu',
				component: () => import('@/views/manageSystem/MyMenu.vue')
			},
		]
	},

	// 阶段案例-学习计划表
	{ path: '/learn', component: () => import('@/views/learnElement/index.vue') },
	// 阶段案例-商品管理
	{
		path: "/goodsManage",
		component: () => import("@/views/goodsManage/index.vue")
	},
	// 阶段案例-待办事项
	{
		path: "/todo",
		component: () => import("@/views/todoVant/index.vue")
	},

	{
		path: "/todoParent",
		component: () => import("@/views/todoParent/index.vue")
	},

	{
		path: "/todoRef",
		component: () => import("@/views/todoRef/index.vue")
	},

	{
		path: "/todoProvide",
		component: () => import("@/views/todoProvide/index.vue")
	},

	// 改造案例-学生作品
	{
		path: "/fruite",
		component: () => import("@/views/fruite/index/index.vue")
	},
	// 改造案例-后台管理	
	{
		path: '/admin',
		component: Admin,
		children: [{
				path: 'home',
				component: () => import("@/views/shop/admin/home/index.vue")
			},
			{
				path: 'order',
				component: () => import("@/views/shop/admin/order/index.vue")
			},
			{
				path: 'news',
				component: () => import("@/views/shop/admin/news/index.vue")
			},
			{
				path: 'goods',
				component: () => import("@/views/shop/admin/goods/index.vue")
			},
			{
				path: 'customer',
				component: () => import("@/views/shop/admin/customer/index.vue")
			},
		]
	},

	{ // 不存在提示
		path: '/:pathMatch(.*)*',
		name: "notFound",
		component: () => import('@/views/NotFound.vue')
	},
]

// 3. 创建路由实例并传递 `routes` 配置
const router = createRouter({
	// 4. 内部提供了 history 模式的实现。为了简单起见，我们在这里使用 hash 模式。
	history: createWebHashHistory(),
	routes, // `routes: routes` 的缩写
})
export default router